.event__header {
  display: flex;
  justify-content: space-between;
  padding-bottom: 10px;
}

.event__header-left {
  display: flex;
  align-items: center;
}

.event__label {
  font-weight: bold;
  font-size: 14px;
}

.event__amount-actions {
  background-color: $color-neutral-100;
  font-size: 11px;
  padding: 1px 7px;
  border-radius: 3px;
}

.event__add-action-context {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 10px;
  padding: 10px;
}

.event__toggle {
  color: $color-neutral-900;
}

.event__workflow-action {
  border-top: 1px solid $color-neutral-200;
  padding-top: 20px;

  // :first-child doesn't work here as the draggable directives adds an element
  &.event__workflow-action--first {
    border-top: none;
    padding-top: 10px;
  }

  &:last-child {
    clear: both;
  }
}
